Fix authentication#573
Conversation
❌ Deploy Preview for github-spy failed.
|
|
Warning Review limit reached
More reviews will be available in 48 minutes and 27 seconds. Learn how PR review limits work. Your organization has run out of usage credits. Purchase more in the billing tab. ⌛ How to resolve this issue?After more reviews become available, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (4)
📝 WalkthroughWalkthroughThis PR fixes authentication API requests returning 404 errors on Netlify production ( ChangesNetlify Production Authentication Flow
Estimated code review effort🎯 2 (Simple) | ⏱️ ~12 minutes Possibly related PRs
Suggested labels
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 inconclusive)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
Your plan includes 1 PR review per hour. Reviews are available now. |
|
@coderabbitai review |
✅ Actions performedReview triggered.
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
src/pages/Login/Login.tsx (1)
33-33:⚠️ Potential issue | 🔴 Critical | ⚡ Quick winMissing
withCredentials: truefor cross-origin cookie support.The PR objective states that
{ withCredentials: true }should be included on Axios requests to send session cookies. Without this option, the browser won't attach cookies on cross-origin requests, breaking authentication in production where frontend and backend are on different domains.🐛 Proposed fix
- const response = await axios.post(`${backendUrl}/api/auth/login`, formData); + const response = await axios.post(`${backendUrl}/api/auth/login`, formData, { withCredentials: true });🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/pages/Login/Login.tsx` at line 33, The axios POST call in the Login component is missing the withCredentials flag so cookies won't be sent cross-origin; update the axios.post call in the Login.tsx submit/login handler (the line creating "response = await axios.post(`${backendUrl}/api/auth/login`, formData)") to include the config object { withCredentials: true } as the third argument so session cookies are attached to the request; ensure the change is made in the function that performs the login request within the Login component.src/pages/Signup/Signup.tsx (1)
86-88:⚠️ Potential issue | 🔴 Critical | ⚡ Quick winMissing
withCredentials: truedespite comment indicating cookie intent.The comment states "Include cookies for session" but the actual
withCredentials: trueoption is absent. This must be added for cross-origin cookie handling to work in production.🐛 Proposed fix
const response = await axios.post(`${backendUrl}/api/auth/signup`, - formData // Include cookies for session + formData, + { withCredentials: true } );🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/pages/Signup/Signup.tsx` around lines 86 - 88, The axios.post call that creates `response` in Signup.tsx claims to "Include cookies for session" but doesn't set withCredentials; update the `axios.post` call that posts to `${backendUrl}/api/auth/signup` to pass the config object `{ withCredentials: true }` (e.g., axios.post(url, formData, { withCredentials: true })) so browsers will send/receive cross-site cookies for the session; keep the existing `formData` argument and ensure no other axios defaults are overriding credentials.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@backend/validators/authValidator.js`:
- Around line 20-23: Update the frontend password validation in
src/pages/Signup/Signup.tsx to match the backend rule used in
backend/validators/authValidator.js: replace the current regex
/^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d@$!%*#?&]{8,}$/ with the backend regex
/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[\W_]).{8,}$/ (update both occurrences
around lines 56 and 77) and ensure the frontend error message mirrors the
backend message ("Password must contain uppercase, lowercase, number, and
special character") so client-side validation matches server-side behavior.
---
Outside diff comments:
In `@src/pages/Login/Login.tsx`:
- Line 33: The axios POST call in the Login component is missing the
withCredentials flag so cookies won't be sent cross-origin; update the
axios.post call in the Login.tsx submit/login handler (the line creating
"response = await axios.post(`${backendUrl}/api/auth/login`, formData)") to
include the config object { withCredentials: true } as the third argument so
session cookies are attached to the request; ensure the change is made in the
function that performs the login request within the Login component.
In `@src/pages/Signup/Signup.tsx`:
- Around line 86-88: The axios.post call that creates `response` in Signup.tsx
claims to "Include cookies for session" but doesn't set withCredentials; update
the `axios.post` call that posts to `${backendUrl}/api/auth/signup` to pass the
config object `{ withCredentials: true }` (e.g., axios.post(url, formData, {
withCredentials: true })) so browsers will send/receive cross-site cookies for
the session; keep the existing `formData` argument and ensure no other axios
defaults are overriding credentials.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: d5d66548-6c79-4559-b97e-ff4ed58c4af4
📒 Files selected for processing (4)
backend/server.jsbackend/validators/authValidator.jssrc/pages/Login/Login.tsxsrc/pages/Signup/Signup.tsx
|
@coderabbitai resolve |
✅ Actions performedComments resolved. Approval is disabled; enable |
|
🎉🎉 Thank you for your contribution! Your PR #573 has been merged! 🎉🎉 |
2 participants
Description
This PR resolves the core issues preventing the authentication flow (Login/Signup) from working in the live production environment (Netlify frontend + Node.js backend).
Previously, API requests were defaulting to the Netlify domain causing
404 Not Founderrors, and the backend was blocking cross-origin requests due to a CORS typo and missing cookie configurations.Changes Made
Frontend Updates (
Signup.tsx&Login.tsx):import.meta.env.VITE_BACKEND_URL || ""to ensure requests route to the correct backend server.{ withCredentials: true }to Axios requests so session cookies are properly sent to the backend.anytype warnings in thecatchblocks by implementing explicit type-checking withaxios.isAxiosError().Backend Updates (
server.js):https://github-spy.etlify.app->https://github-spy.netlify.app).app.set('trust proxy', 1);which is necessary for setting secure cookies when the backend is deployed behind a proxy (like Render/Railway).express-sessionto usesecure: process.env.NODE_ENV === 'production'andsameSite: 'none'(when in production) so browsers don't block the third-party session cookies.Important Action Required by Maintainers
For this fix to work on the live deployment, please ensure the following Environment Variables are set in your hosting platforms:
VITE_BACKEND_URLpointing to the live backend API URL.NODE_ENV=productionis set so the secure cookie flags are activated.Closes #561
Assigned under GSSoC 26
Summary by CodeRabbit
Bug Fixes
Chores